<template>
  <div class="page luckdraw-record-win">
    <list-item v-for="(item, i) in recordList" :key="i" :listData="item"></list-item>
    <empty-tip v-if="showEmptyTip"></empty-tip>
    <a class="load-more" v-if="showNoMore">没有更多了</a>
    <a class="load-more" v-if="showLoadMore">加载中...</a>
  </div>
</template>

<script>
import ListItem from 'comp/list-item'
import EmptyTip from 'comp/empty-tip'
import mixins from 'comp/mixins'

export default {
  mixins: [mixins],
  components: {
    ListItem,
    EmptyTip
  },
  data () {
    return {
      recordType: '',
      openId: '',
      recordList: [],
      page: 1,
      showEmptyTip: false,
      showNoMore: false,
      showLoadMore: false
    }
  },
  onReachBottom () {
    // 页面上拉触底事件的处理函数
    if (this.showLoadMore) {
      this.getPageData()
    }
  },
  async mounted () {
    this.resetData()
    // 保存入口类别，all, self, win
    this.recordType = this.$root.$mp.query.type
    this.setTitle()
    this.openId = await this.getOpenId()
    this.getPageData()
  },
  methods: {
    setTitle () {
      let title = ''
      if (this.recordType === 'all') {
        title = '参与的抽奖'
      } else if (this.recordType === 'self') {
        title = '发起的抽奖'
      } else if (this.recordType === 'win') {
        title = '中奖记录'
      }
      wx.setNavigationBarTitle({
        title
      })
    },
    async getPageData () {
      let page = this.page
      let res = []
      if (this.recordType === 'all') {
        // 参与的抽奖
        res = await this.$store.dispatch('getPlayerActivity', {
          playerid: this.openId,
          page,
          rows: 10
        })
      } else if (this.recordType === 'self') {
        // 发起的抽奖
        res = await this.$store.dispatch('getActivityList', {
          createrId: this.openId,
          page,
          rows: 10
        })
      } else if (this.recordType === 'win') {
        // 中奖记录
        res = await this.$store.dispatch('getPlayerActivity', {
          playerid: this.openId,
          page,
          rows: 10,
          iswinner: 1
        })
      }
      const arr1 = this.recordList
      const arr2 = res.list
      if (arr1.length === 0 && arr2.length === 0) {
        // 暂无记录
        this.showEmptyTip = true
      } else {
        if (arr2.length < 10) {
          // 没有更多了
          this.showNoMore = true
          this.showLoadMore = false
        } else {
          // 加载中...
          this.showLoadMore = true
        }
      }
      this.recordList = arr1.concat(arr2)
      this.page = ++page
    }
  }
}
</script>

<style lang="less" scoped>
.luckdraw-record-win {
  .load-more {
    font-size: 28rpx;
    color: #448ff0;
    text-align: center;
    padding: 30rpx 0 70rpx;
  }
}
</style>
